// http://leafletjs.com/examples/quick-start-example.html in TypeScript
/// <reference path="leaflet.d.ts" />
var map = new L.Map("map");
map.setView(new L.LatLng(51.505, -0.09), 13);
var layer =new L.TileLayer("http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png", { maxZoom: 18, attribution: "attribution test" })
layer.addTo(map);

// add marker
var marker = new L.Marker(new L.LatLng(51.5, -0.09));
marker.addTo(map).bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup();

// add circle
var circle = new L.Circle(new L.LatLng(51.508, -0.11), 500, {
  		color: 'red',
			fillColor: '#f03',
			fillOpacity: 0.5
		}).addTo(map).bindPopup("I am a circle.");

// add polygon
var latlongs : L.LatLng[];
latlongs= [
    new L.LatLng(51.509, -0.08),
    new L.LatLng(51.503, -0.06),
    new L.LatLng(51.51, -0.047)
];
var polygon = new L.Polygon(latlongs).addTo(map).bindPopup("I am a polygon.");

// popup on mapclick
var popup = new L.Popup();

function onMapClick(e) {
	popup
		.setLatLng(e.latlng)
		.setContent("You clicked the map at " + e.latlng.toString())
		.openOn(map);
}

map.on('click', onMapClick);
